<template>
  <div class="base-container">
    <el-form ref="form" :model="form" label-width="25%">
      <div style="margin-bottom: 32px;">
        <el-row>
          <el-col>
            <h3 style="text-align: center;font-size:20px;color:#444;margin-bottom:32px;">{{form.control_title}}</h3>
          </el-col>
        </el-row>
        <div class="e-con-textarea">
          <el-row style="max-width:100%;">
            <el-col>
              <el-form-item label="评价标准" label-width="9.5%">
                <el-input type="textarea" v-model="form.evaluation_criterion" readonly></el-input>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="控制证据" label-width="9.5%">
                <el-input type="textarea" v-model="form.control_evidence" readonly></el-input>
              </el-form-item>
            </el-col>
            <el-col>
              <el-form-item label="检查方法" label-width="9.5%">
                <el-input type="textarea" v-model="form.inspection_method"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="16">
            <el-col :span="6">
              <el-form-item label="影响程度" label-width="40%">
                <el-input style="width:100%;" type="text" v-model="form.affect_extent" readonly></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="控制效果" label-width="40%">
                <el-input style="width:100%;" type="text" v-model="form.control_effect" readonly></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="标准分值" label-width="40%">
                <el-input style="width:100%;" type="text" v-model="form.control_effect" readonly></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="关键控制点" label-width="40%">
                <el-input style="width:100%;" type="text" v-model="form.control_effect" readonly></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="16">
            <el-col :span="6">
              <el-form-item label="内控类型" label-width="40%">
                <el-input style="width:100%;" v-model="form.control_type" readonly></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="SPA控制" label-width="40%">
                <el-input style="width:100%;" v-model="form.control_type" readonly></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="集团控制" label-width="40%">
                <el-input style="width:100%;" v-model="form.control_type" readonly></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="系统控制" label-width="40%">
                <el-input style="width:100%;" v-model="form.control_type" readonly></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row :gutter="16">
            <el-col :span="6">
              <el-form-item label="法规要求" label-width="40%">
                <el-input style="width:100%;" v-model="form.control_type" readonly></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </div>

      </div>


      <div class="e-form-part2">
        <h3 class="table-title"><span>样本总量确定方法</span></h3>
        <div class="table-content" >
          <el-table
            :data="form.samplemethod"
            ref="table1"
            border
            borderColor="#f00"
            style="width: 100%">
            <el-table-column
              prop="samplemethod_num"
              label="检查项"
              width="80px">
            </el-table-column>
            <el-table-column
              prop="samplemethod_content"
              label="描述">
            </el-table-column>
          </el-table>
        </div>

      </div>


      <div class="e-form-part2">
        <h3 class="table-title"><span>样本检查内容</span></h3>
        <div class="table-content">
          <el-table
            border
            ref="table2"
            borderColor="#f00"
            :data="form.samplemaintain">
            <el-table-column
              prop="samplemaintain_num"
              label="检查项"
              width="80px">
            </el-table-column>
            <el-table-column
              prop="samplemaintain_desc"
              label="描述">
            </el-table-column>
          </el-table>
        </div>

      </div>

    </el-form>
  </div>
</template>
<script>
  import fixed from '@/components/fixed.vue'
  import userHeader from '@/components/header.vue'
  import {strToHexCharCode, toFixedBit, dec2hex, formatTime, getNewDate} from '@/utils/index.js'
  import treeToArray from '@/page/test/index.js';
  import Clickoutside from 'element-ui/lib/utils/clickoutside';

  export default ({
    props:{
      form:{
        type:Object
      }
    },
   computed: {
      standard_score: function () {
        if (this.form.affect_extent && this.form.control_effect) {
          return this.form.affect_extent * this.form.control_effect
        } else {
          return 0
        }
      },
     affect_extent(){
        this.effectDegree.forEach(el=>{
          if(el.degree == form.affect_extent){
            return
          }
        })
     }


    },
    data() {
      return {
        effectDegree: [
          {
            degree: "1",
            percent: "1%以下",
            target: "极轻微的",
            Operationlevel: "不受影响",
          },
          {
            degree: "2",
            percent: "1%至5%",
            target: "轻微的",
            Operationlevel: "轻度影响",
          },
          {
            degree: "3",
            percent: "5%至10%",
            target: "中等的",
            Operationlevel: "中度影响",
          },
          {
            degree: "4",
            percent: "10%-20%",
            target: "重要的",
            Operationlevel: "严重影响",
          },
          {
            degree: "5",
            percent: " 20%以上",
            target: "重大的",
            Operationlevel: "重大影响",
          }
        ]
      }
    }

  })
</script>
<style scoped>
  .table-title{
    color:#5d9122;
    line-height: 50px;
    border-bottom: 1px solid #5d9122;
  }
  .table-content{
    background:#f3f9ed;
    padding: 25px 20px;
    box-sizing: border-box;
  }
</style>
